<template>
	<view>
		<cu-custom bgColor="bg-gradual-green" :isBack="true">
			<view slot="backText">返回</view>
			<view slot="content">登录</view>
		</cu-custom>

		<view class="cu-list menu card-menu margin-top margin shadow-lg radius bg-white">
			<view class="justify-center flex margin-lg">
				<view class="cu-avatar xl round" style="background-color: white;"></view>
				<!-- <view class="cu-avatar xl round" style="background-image: url(../../static/logo.png);"></view> -->
			</view>
			<view class="title padding sm-border text-bold text-lg">账号密码登录</view>
			<form>
				<view class="cu-form-group">
					<text class="margin-right-sm text-red">*</text>
					<input placeholder="请输入用户名" v-model.lazy="loginInfo.userName"></input>
				</view>
				<view class="cu-form-group margin-bottom">
					<text class="margin-right-sm text-red">*</text>
					<input placeholder="请输入密码" type="password" v-model.lazy="loginInfo.password"></input>
				</view>
			</form>
			<view class="flex">
				<radio class="padding-left" value="A" style="transform: scale(0.6);" color="#39b54a" :checked="agreed"
					@click="agreed = !agreed"></radio>
				<view class="text-sm margin-top-xs">
					同意<text class="text-blue">用户服务协议</text>和
					<text class="text-blue">隐私政策条款</text>
				</view>
			</view>
			<view class="flex padding justify-center">
				<button class="cu-btn lg bg-green" @click="pwdLogin">登录</button>
			</view>
			<view class="flex justify-between margin-lr-sm margin-bottom-xs text-sm">
				<view>
					<text>忘记了?</text>
					<text class="text-blue" @click="toRetrievePwd">找回密码</text>
				</view>
				<text class="text-blue" @click="toRegister">注册账号</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: this.url,
				loginInfo: {
					userName: '',
					password: '',
				},
				userInfo: {
					nickname: '',
					avatar: ''
				},
				captcha: '',
				agreed: false
			}
		},
		methods: {
			pwdLogin() {
				// var userInfo = {
				// 	nickname: "橙猫猫",
				// 	avatarUrl: "https://tupian.qqw21.com/article/UploadPic/2020-1/20201122246510666.jpg",
				// 	gender: 1,
				// }
				// uni.setStorageSync('userInfo', userInfo)

				uni.request({
					method: 'POST',
					url: this.url + '/login',
					data: this.loginInfo,
					success: (res) => {
						console.log(res)
						if (res.statusCode == 200) {
							this.$store.dispatch('updateUserInfo', res.data)
							// this.$store.dispatch('updateUserInfo', JSON.stringify(res.data))
							uni.navigateBack()
						} else {
							uni.showToast({
								title: '用户名或密码错误',
								icon: 'none',
								duration: 1500
							})
						}
					},
					fail: (err) => {
						console.log('err', err);
						uni.showToast({
							title: '用户名或密码错误',
							duration: 1500,
							icon: 'none'
						})
					}
				})
			},
			toRegister() {
				uni.navigateTo({
					url: '../register/register'
				})
			}
		}
	}
</script>

<style scoped>

</style>
